<template>
  <a-modal
    v-model="show"
    title="发布声明"
    width="600px"
    :maskClosable="false"
    :footer="null"
    @cancel="handleClose"
  >
    <div class="deal-detail">
      <a-spin tip="Loading..." :spinning="loading">
        <template v-if="!canChangeState">
          <a-row>
            <a-col :span="24">
              当前投票结果为隐藏状态（参与投票的用户无法查看投票结果）
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="12">
              <span class="needRed">进行官方发布是否公开投票结果？</span>
            </a-col>
            <a-col :span="12">
              <a-radio-group v-model="form.voteResult">
                <a-radio :value="1">是</a-radio>
                <a-radio :value="0">否</a-radio>
              </a-radio-group>
            </a-col>
          </a-row>
        </template>
        <a-row>
          <a-col :span="24">
            <a-input
              v-model.trim="form.content"
              type="textarea"
              :rows="4"
              :maxLength="300"
              placeholder="请输入声明内容"
            >
            </a-input>
          </a-col>
        </a-row>
        <a-row>
          <a-col>
            <span class="pwd-tip">上限300个字</span>
          </a-col>
        </a-row>
        <div class="footer">
          <a-button type="default" @click="handleClose">取消</a-button>
          <a-button type="primary" @click="handleOk">保存</a-button>
        </div>
      </a-spin>
    </div>
  </a-modal>
</template>

<script>
import httpApi from "@/api/account";

export default {
  data() {
    return {
      show: false,
      loading: false,
      form: {
        voteResult: 0,
        content: undefined
      }
    };
  },
  props: {
    visible: {
      type: Boolean,
      required: true,
      default: false
    },
    row: {
      type: Object,
      required: true,
      default: () => ({})
    }
  },
  watch: {
    visible: {
      immediate: true,
      handler(value) {
        this.show = value;
      }
    }
  },
  computed: {
    canChangeState() {
      //显示
      return this.row.result === 1;
    }
  },
  methods: {
    handleOk() {
      debugger;
      console.log(this.form);
      console.log(this.canChangeState);
      this.loading = true;
      httpApi
        .save()
        .then((res) => {
          if (res.retcode === 0) {
            this.$message.success(`发布成功！`);
            this.handleClose();
          } else {
            this.$message.error(`发布失败！`);
          }
          this.loading = false;
        })
        .catch((err) => {
          this.$message.error(err.msg);
          this.loading = false;
        });
    },
    handleClose() {
      this.$emit("close", false);
    }
  }
};
</script>

<style lang="less" scoped>
.deal-detail {
  min-height: 180px;
  .ant-row {
    padding: 10px 30px;
    .needRed::before {
      content: "*";
      color: red;
      margin-right: 2px;
    }
    .pwd-tip {
      height: 34px;
      display: inline-block;
      .font-Medium(14px,rgba(0, 0, 0, 0.35),18px,400);
    }
  }
  .footer {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding: 14px 20px 0 20px;

    .flex(flex-end);
    .ant-btn {
      margin-left: 10px;
    }
  }
}
</style>
